<template>
  <div style="height: 300px;margin-top: 15px; line-height: 50px;box-shadow:1px 1px 2px #a6a6a6; display: flex;background-color: white">
    <div style="flex: 1;margin: auto;padding-left: 300px;padding-bottom: 50px">
      <UploadAvatar/>
    </div>

    <div style="flex: 1;margin: auto;padding-bottom: 50px;padding-right: 400px">
      <div style="width: 300px;margin: 24px 0">
        <a-textarea
            v-model:value="signature"
            placeholder="个人签名"
            :auto-size="{ minRows: 2, maxRows: 5 }"
            allow-clear
            @input="update"
        />
      </div>
      <div>
        <a-upload
            v-model:file-list="fileList"
            @remove="false"
            list-type="picture"
            :max-count="1"
            :customRequest="upload"
            @change="uploadHandleChange"

        >
          <a-button>
            <upload-outlined></upload-outlined>
            上传简历
          </a-button>
        </a-upload>
      </div>
    </div>
  </div>
</template>

<script setup>
import UploadAvatar from "@/components/admin/administration/UploadAvatar";
import {onMounted,  ref} from "vue";
import request from "@/utils/request";
import {debounce} from "lodash-es";
import {UploadOutlined} from "@ant-design/icons-vue";
import {put} from "@/utils/OSS";
import {message} from "ant-design-vue";

const signature=ref('')
const fileList = ref([{
  name:'resume',
  status:'done',
  url:'',
  thumbUrl:'https://avatar-blog-golxen.oss-cn-shenzhen.aliyuncs.com/avatar/avatar',
}])


onMounted(()=>{
  request.get('admin/get/signature').then(res=>{
    console.log(res)
    signature.value=res.data
  })

  request.get('admin/get/resume').then(res=>{
    console.log(res)
    fileList.value[0].url=res.data
  })
})

const update = debounce((e) => {
  request.post('admin/update/signature',e.target.value).then(res=>{
    console.log(res)
    console.log(signature.value)
  })
}, 5000)

function upload(action) {
  const file = action.file
  put("resume/resume",file).then(result=>{
    request.post('admin/update/resume',result.url).then(res=>{
      console.log(res)
      fileList.value[0].url=result.url
      fileList.value[0].status='done'
      fileList.value[0].name='resume'
    })

  })
}

const uploadHandleChange = info => {
  if (info.file.status !== 'uploading') {
    console.log(info.file, info.fileList);
  }
  if (info.file.status === 'done') {
    message.success(`${info.file.name} file uploaded successfully`);
  } else if (info.file.status === 'error') {
    message.error(`${info.file.name} file upload failed.`);
  }
  fileList.value[0].status=info.file.status
};


</script>
